<template>
  <div>
    <div class="demo-nav">
      <div class="demo-nav__title">账号与安全</div>
      <svg viewBox="0 0 1000 1000" class="demo-nav__back" @click="toBack">
        <path fill-rule="evenodd" fill="#969799" d="M296.114 508.035c-3.22-13.597.473-28.499 11.079-39.105l333.912-333.912c16.271-16.272 42.653-16.272 58.925 0s16.272 42.654 0 58.926L395.504 498.47l304.574 304.574c16.272 16.272 16.272 42.654 0 58.926s-42.654 16.272-58.926 0L307.241 528.058a41.472 41.472 0 0 1-11.127-20.023z"></path>
      </svg>
    </div>
    <div align="left">
      <router-link :to="'/PersonalData'"><van-cell title="修改手机号" :value=chaList.loginName is-link/></router-link>
      <van-cell title="修改登陆密码" is-link @click="xiugai" />
      <van-cell title="账号注销" @click="zhuxiao" is-link/>
      <van-cell @click="shezhimi()" title="支付密码" is-link/>

    </div>
  </div>
</template>

<script>
  import { passwordedit,passwordadd } from "@/api/customer/passwordcode";
  import { longdelInfo,findCustListById } from "../../../api/customerinf";
  import {Dialog, Toast} from 'vant';
  export default {
    name: "AccountSecurity",
    data(){
      return{
        form:{},
        show: false,
        chaList:Array,
        phone:'',
      }
    },
    created() {
      this.findCustById();
    },
    methods:{
      xiugai(){
        this.$router.push({
            path: "/reset_password",
            query: {phone: this.phone}
          }
        );
      },

      findCustById(){
        findCustListById().then(res=>{
          this.chaList = res.data.data
          this.phone = res.data.data.loginName
        })
      },

      beforeClose(){
        console.log("aaas")

      },

      zhuxiao(){
        // this.show = true;
        Dialog.confirm({
          title: '标题',
          message: '您确认注销此账号吗',
        })
          .then(() => {
            Toast({
              message: "注销成功。",
              position: "top"
            });
            this.$router.push({path:"/login_index"});
            return longdelInfo();
          })
          .catch(() => {
            // on cancel
          });
      },

      shezhimi(){

        passwordadd(this.form).then(res=>{

          this.$router.push({
          path:"/ShezhiMima",
          // query:{customerId: this.form.customerId}
        });
      })
      },

      //返回上一层
      toBack(){
        this.$router.go(-1);
      },
    }
  }
</script>

<style scoped>
  .demo-nav{
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 56px;
    background-color: #fff;
    font-size: 1.1rem;
  }
  .demo-nav__back{
    position: absolute;
    top: 16px;
    left: 16px;
    width: 24px;
    height: 24px;
    cursor: pointer;
  }
</style>
